<div style="min-width:1210px">
  <nz-breadcrumb class="breadcrumb-pos">
    <i nz-icon type="link" theme="outline" style="color:#1890FF;padding-right:4px"></i>
    <nz-breadcrumb-item>
      <a routerLink="/main/printer">打印机</a>
    </nz-breadcrumb-item>
    <nz-breadcrumb-item>
      打印机详情
    </nz-breadcrumb-item>
  </nz-breadcrumb>
  <div class="form-div">
    <button class="add_btn" nz-button nzType="primary" routerLink="/main/printer">返回</button>
    <br>
    <h4>基础信息</h4>
    <table>
      <tr>
        <td>
          <div>设备名称</div>
          <div>：</div>
          <div>{{data[0].name}}</div>
        </td>
        <td>
          <div>品牌/型号</div>
          <div>：</div>
          <div>{{data[0].brandName}} / {{data[0].typeCode}}</div>
        </td>
        <td>
          <div>设备状态</div>
          <div>：</div>
          <div>{{data[0].statusStr}}</div>
        </td>
        <td>
          <div>盒子标识码</div>
          <div>：</div>
          <div>{{data[0].codes?data[0].codes:"-"}}</div>
        </td>
      </tr>
      <tr>
        <td>
          <div>Mac</div>
          <div>：</div>
          <div>{{data[0].mac?data[0].mac:"-"}}</div>
        </td>
        <td>
          <div>设备存放位置</div>
          <div>：</div>
          <div>{{data[0].location?data[0].location:"-"}}</div>
        </td>
        <td>
          <div>添加时间</div>
          <div>：</div>
          <div>{{data[0].dateAdd?data[0].dateAdd.slice(0,10):'--'}}</div>
        </td>
        <td>
          <div>上次维修时间</div>
          <div>：</div>
          <div>{{data[0].lastDate?data[0].lastDate:'--'}}</div>
        </td>
      </tr>
    </table>

    <br>

    <h4>墨量信息</h4>
    <table>
      <tr>
        <td>
          <div>黑色墨总量</div>
          <div>：</div>
          <div>{{data[0].kSum}}</div>
        </td>
        <td>
          <div>青色墨总量</div>
          <div>：</div>
          <div>{{data[0].cSum}}</div>
        </td>
        <td>
          <div>红色墨总量</div>
          <div>：</div>
          <div>{{data[0].mSum}}</div>
        </td>
        <td>
          <div>黄色墨总量</div>
          <div>：</div>
          <div>{{data[0].ySum}}</div>
        </td>
      </tr>
      <tr>
        <td>
          <div>黑色余量</div>
          <div>：</div>
          <div>{{data[0].kResidue?data[0].kResidue:"-"}}%</div>
        </td>
        <td>
          <div>青色余量</div>
          <div>：</div>
          <div>{{data[0].cResidue?data[0].cResidue:"-"}}%</div>
        </td>
        <td>
          <div>红色余量</div>
          <div>：</div>
          <div>{{data[0].mResidue?data[0].mResidue:"-"}}%</div>
        </td>
        <td>
          <div>黄色余量</div>
          <div>：</div>
          <div>{{data[0].yResidue?data[0].yResidue:"-"}}%</div>
        </td>
      </tr>
      <tr>
        <td>
          <div>黑色预警值</div>
          <div>：</div>
          <div>{{config[0]?config[0].kWarning:'--'}}%</div>
        </td>
        <td>
          <div>青色预警值</div>
          <div>：</div>
          <div>{{config[0]?config[0].cWarning:'--'}}%</div>
        </td>
        <td>
          <div>红色预警值</div>
          <div>：</div>
          <div>{{config[0]?config[0].mWarning:'--'}}%</div>
        </td>
        <td>
          <div>黄色预警值</div>
          <div>：</div>
          <div>{{config[0]?config[0].yWarning:'--'}}%</div>
        </td>
      </tr>
    </table>

    <br>

    <h4>签约信息</h4>
    <table>
      <tr>
        <td>
          <div>租户名称</div>
          <div>：</div>
          <div>{{data[0].isSigned && data[0].isSigned !==2?user[0].name:'-'}}</div>
        </td>
        <td>
          <div>签约状态</div>
          <div>：</div>
          <div>{{data[0].isSigned?"已签约":"未签约"}}</div>
        </td>
        <td>
          <div>开始时间</div>
          <div>：</div>
          <div>{{data[0].signedBegin?data[0].signedBegin.slice(0,10):'--'}}</div>
        </td>
        <td>
          <div>结束时间</div>
          <div>：</div>
          <div>{{data[0].signedEnd?data[0].signedEnd.slice(0,10):'--'}}</div>
        </td>
      </tr>
      <tr>
        <td>
          <div>结算期数</div>
          <div>：</div>
          <div>{{data[0].paySum}}</div>
        </td>
        <td>
          <div>黑白打印量</div>
          <div>：</div>
          <div>{{data[0].blackCount?data[0].blackCount:0}}</div>
        </td>
        <td>
          <div>彩色打印量</div>
          <div>：</div>
          <div>{{data[0].coloursCount?data[0].coloursCount:0}}</div>
        </td>
        <td>
          <div>总打印量</div>
          <div>：</div>
          <div>{{data[0].blackCount  && data[0].blackCount?data[0].blackCount + data[0].coloursCount:0}}</div>
        </td>
      </tr>
    </table>

    <br>

    <nz-radio-group [(ngModel)]="radioValue" (ngModelChange)="getRadioValue()" style="margin-bottom:12px;">
      <label nz-radio-button [nzValue]="'1'">抄表记录</label>
      <label nz-radio-button [nzValue]="'2'">抄表账单</label>
      <label nz-radio-button [nzValue]="'3'">任务记录</label>
    </nz-radio-group>
    <nz-table *ngIf="radioValue=='1'" [nzData]="datalist" [nzShowPagination]="false" [nzBordered]="true">
      <thead>
        <tr>
          <th>租户名称</th>
          <th>黑白打印量</th>
          <th>彩色打印量</th>
          <th>打印总量</th>
          <th>统计时间</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of datalist">
          <td>{{userinfo[data.userId].name}}</td>
          <td>{{data.blackYieldSum}}</td>
          <td>{{data.coloursYieldSum}}</td>
          <td>{{data.blackYieldSum + data.coloursYieldSum}}</td>
          <td>{{data.dateStatistics.slice(0,10)}}</td>
        </tr>
      </tbody>
    </nz-table>
    <nz-table *ngIf="radioValue=='2'" [nzData]="billlist" [nzShowPagination]="false" [nzBordered]="true">
      <thead>
        <tr>
          <th>租户名称</th>
          <th>黑白打印量</th>
          <th>彩色打印量</th>
          <th>打印金额</th>
          <th>统计时间</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of billlist">
          <td>{{userbillinfo[data.userId].name}}</td>
          <td>{{data.blackYield}}</td>
          <td>{{data.coloursYield}}</td>
          <td>{{data.printMoney}}</td>
          <td>{{data.dateUpdate?data.dateUpdate.slice(0,10):"--"}}</td>
        </tr>
      </tbody>
    </nz-table>
    <nz-table *ngIf="radioValue=='3'" [nzData]="tasklist" [nzShowPagination]="false" [nzBordered]="true">
      <thead>
        <tr>
          <th>任务类型</th>
          <th>维修员</th>
          <th>任务名称</th>
          <th>状态</th>
          <th>完成时间</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of tasklist">
          <td>{{data.type==0?"故障":"预警"}}</td>
          <td>{{data.maintId?maintinfo[data.maintId].name:"-"}}</td>
          <td>{{data.taskName}}</td>
          <td>{{data.statusStr}}</td>
          <td>{{data.dateUpdate?data.dateUpdate.slice(0,10):"--"}}</td>
        </tr>
      </tbody>
    </nz-table>
    <nz-pagination style="float:right;margin-top:12px" [nzPageIndex]="PageIndex" [nzPageSize]="PageSize"
      [nzTotal]="PageTotal" (nzPageIndexChange)="PageIndexChange($event)" [nzHideOnSinglePage]="true"
      [nzShowTotal]="totalTemplate"></nz-pagination>
    <ng-template #totalTemplate let-total>
      共 {{total}} 条数据
    </ng-template>
  </div>
</div>